import { ref, onMounted } from 'vue'
// import type 是用来协助进行类型检查和声明的
import type { Ref } from 'vue'
import { RequestCategoryList, RequestProductListByCategoryId, RequestProductListByCategoryId1 } from "@/api/product";
import {RequestProductSearch} from '@/api/search'
import { useRouter, useRoute } from 'vue-router'


//类型检测
interface ICategory {
    id: number,
    text: string,
}

export const useCategory = () => {
    const activeId = ref(1)
    const activeIndex = ref(0);
    let categoryList: Ref<Array<ICategory>> = ref([])
    let selectList: Ref<Array<ICategory>> = ref([])
    // let searchList: Ref<Array<ICategory>> = ref([])
    const searchValue = ref('');

    /**
     * 商品分类列表
     */
    const getCategoryList = async () => {
        let data = await RequestCategoryList()
        let { resultCode, resultInfo } = data
        if (resultCode == 1) {
            let list = resultInfo.list
            categoryList.value = list.map((item: ICategory) => {
                return { id: item.id, text: item.name }
            });
            getCategoryListById(categoryList.value[0].id)

        }
    }

    /**
     * 商品列表
     */
    const getCategoryListById = async (categoryId: number) => {
        let data = await RequestProductListByCategoryId(categoryId)
        // console.log(data);

        let { resultCode, resultInfo } = data
        if (resultCode == 1) {
            selectList.value = resultInfo.list
        }
        if (resultCode == -1) {
            getCategoryListById1(categoryId)
        }
    }
    /**
     * 添加的mock商品数据
     */
    const getCategoryListById1 = async (categoryId: number) => {
        let data1 = await RequestProductListByCategoryId1(categoryId)
        // console.log(categoryId);

        let { list1, list2, list3 } = data1.data.resultInfo1

        if (categoryId == 7) {
            selectList.value = list1
        }
        else if (categoryId == 8) {
            selectList.value = list2
        }
        else if (categoryId = 9) {
            selectList.value = list3
        }
    }

    /**
     * 选中分类列表
     */
    const onSelector = (index: number) => {
        let categoryId = categoryList.value[index].id //商品分类id
        // console.log(categoryId);
        getCategoryListById(categoryId)
    }

    /**
     * 分类页面的搜索
     */
    const router = useRouter()
    const route = useRoute()
    const onClickButton = async() => {
        // if(searchValue.value){
            searchValue.value=searchValue.value
            //  router.push({ path: '/categorySearch' })
            router.push({path:'/search'})
             return searchValue
        // }
       
    }

    /**
     * 商品搜索列表
     */
     const getSearchList = async (productSearch: string) => {
        let data = await RequestProductSearch(productSearch)
        let { resultCode, resultInfo } = data
        if (resultCode == 1) {
            searchList.value = resultInfo.list
        }
    }


    onMounted(() => {
        getCategoryList()

    })

    return{
        activeId,
        activeIndex,
        categoryList,
        selectList,
        searchValue,
        onSelector,
        onClickButton,
        getSearchList
    }
}
